/*
	Class: Focus
		Highlights active field in a form and allows to add a class to every fields, except radio and checkbox


	Parameters:
		form_id - The id of the formular. By default it is 'mainform'.
		setBorder - If you want to add a class to each fields, except radio and checkbox.
		elementClass - The class to apply to each fields. By default it is 'input_f'.
		txtcolor - Text color when it is highlighted.
		bgcolor - Background-color when it is highlighted.
		duration - Duration of the fade effect.
		
		
	Exemple:
		You can initialize a focus by adding this in your html head this code :
		
		(code)
		<script type="text/javascript">
			window.addEvent('domready', function() {
				var myFocus = new Focus({
					form_id : 'mainform',
					setBorder : true,
					txtcolor : '#000000',
					bgcolor : '#ffffff',
					elementClass : 'input_f',
					duration : 742
				});
			});
		</script>
		(end code)
	
	
	Require:
	(code)
	Core
	
	    * Core.js
	
	Class
	
	    * Class.js
	(end code)
	
	
	About:
		focus.js v.1.0 for mootools v1.1 05 / 2007
		
		by Floor SA (http://www.floor.ch) MIT-style license
		
		created by David Mignot and Luca Pillonel, last modified by David Mignot 05 june 07
*/
var Focus = new Class({
	/*
	focus.js v.1.0 for mootools v1.1
	by Floor SA (http://www.floor.ch) - MIT-style license
	05 / 2007
	*/
	
	options : {
		form_id :		'mainform',					// Formular ID
		setBorder : 	true,						// Add a class to form fields (except radio and checkbox)
		txtcolor : 		'#000000',					// Txt color when active
		bgcolor : 		'#ffffff',					// Bg color when active
		elementClass : 	'input_f',					// Class to apply to all form element (except radio, checkbox)
		duration : 		742,						// Fade duration
		transition:		Fx.Transitions.quartOut
	},
	
	/*
	Constructor: initialize
		Constructor
	
		Lauch the class
	*/
	initialize: function(options){
		this.setOptions(options);	
		this.elementArray = [];
		$ES('input, textarea, select', this.options.form_id).each(function(el){
			if(el.type != 'radio' && el.type != 'checkbox' && el.type != 'submit')
				{
					this.elementArray.push(el);
				}
		}.bind(this));
		this.addElementEvent();
	},
	
	/*
	Function: validate
		Private method
		
		Add listener on submit action and launch check process.
	*/
	addElementEvent: function(){
		this.elementArray.each(function(el){
			if(this.options.setBorder) el.addClass(this.options.elementClass);
			el.effectC = new Fx.Styles(el, {duration: this.options.duration, wait: false, transition: this.options.transition});
			el.bgColor = el.getStyle('background-color');
			el.origColor = el.getStyle('color');
			el.addEvents({
				'focus': function(){this.changeBackground(el);}.bind(this),
				'blur': function(){this.revertBack(el);}.bind(this)
			});
		}.bind(this));
	},
	
	/*
	Function: changeBack
		Private method
		
		Style the an hover style
	*/
	changeBackground: function(el){
		el.effectC.start({
			'background-color': [el.bgColor,this.options.bgcolor],
			'color': [el.origColor,this.options.txtcolor]
		});
	},
	
	/*
	Function: revertBack
		Private method
		
		Style the element with the original style
	*/
	revertBack: function(el){
		el.effectC.start({
			'background-color': [this.options.bgcolor,el.bgColor],
			'color': [this.options.txtcolor,el.origColor]
		});
	}
});

Focus.implement(new Options);